<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro"
      xmlns:c="http://java.sun.com/jsp/jstl/core" xmlns:fn="http://java.sun.com/jsp/jstl/functions"
      xmlns:fmt="http://java.sun.com/jsp/jstl/fmt">
<head>
    <meta charset="UTF-8">
    <title>upload bolckchain</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta http-equiv="Content-Type" content="multipart/form-data; charset=utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="/admin/css/common.css" />
    <link rel="stylesheet" href="/layui/css/layui.css" />
</head>
<form class="layui-form" action="" enctype="multipart/form-data">
    <div class="layui-form user-info-form layui-text" style="max-width: 400px;padding-top: 25px;">
        <div class="layui-form-item">
            <label class="layui-form-label">发票代码:</label>
            <div class="layui-input-block">
                <input type="text" id="invoiceCode" class="layui-input" name="invoiceCode" lay-verify="required">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">发票号码:</label>
            <div class="layui-input-block">
                <input type="text" name="invoiceNumber" class="layui-input" id="invoiceNumber" lay-verify="required">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">开票日期:</label>
            <div class="layui-input-block">
                <input type="text" name="invoiceDate" class="layui-input" id="invoiceDate" lay-verify="required">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">购买方名称:</label>
            <div class="layui-input-block">
                <input type="text" name="purchaserName" class="layui-input" id="purchaserName" lay-verify="required">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">购买方纳税人识别号:</label>
            <div class="layui-input-block">
                <input type="text" name="buyTaxpayerNumber" class="layui-input" id="buyTaxpayerNumber" lay-verify="required">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">销售方名称:</label>
            <div class="layui-input-block">
                <input type="text" name="sellerName" class="layui-input" id="sellerName" lay-verify="required">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">销售方纳税人识别号:</label>
            <div class="layui-input-block">
                <input type="text" name="sellerTaxpayerNumber" class="layui-input" id="sellerTaxpayerNumber" lay-verify="required">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">发票金额:</label>
            <div class="layui-input-block">
                <input type="number" name="invoiceAmount" class="layui-input" id="invoiceAmount" lay-verify="number">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">货物或应税劳务、服务名称:</label>
            <div class="layui-input-block">
                <input type="text" name="typeName" class="layui-input" id="typeName" lay-verify="required">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">收款人:</label>
            <div class="layui-input-block">
                <input type="text" name="payee" class="layui-input" id="payee" lay-verify="required">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">复核:</label>
            <div class="layui-input-block">
                <input type="text" name="toReview" class="layui-input" id="toReview" lay-verify="required">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">开票人:</label>
            <div class="layui-input-block">
                <input type="text" name="drawer" class="layui-input" id="drawer" lay-verify="required">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">hashValue:</label>
            <div class="layui-input-block">
                <input type="text" id="hashValueShow" class="layui-input" style="width: 400px;border: 0px" readonly>
            </div>
        </div>
    </div>
    <div class="bottom">
        <div class="button-container">
            <button type="submit" class="layui-btn layui-btn-normal layui-btn-sm" lay-submit="" lay-filter="data-blockchain">
                <i class="layui-icon layui-icon-ok"></i>
                发票上链
            </button>
            <button type="reset" class="layui-btn layui-btn-primary layui-btn-sm">
                <i class="layui-icon layui-icon-refresh"></i>
                重置
            </button>
        </div>
    </div>
</form>

</body>

<script src="/layui/layui.js"></script>
<script>
    layui.use(['form', 'layedit', 'laydate','upload'], function () {
        var form = layui.form
            , layer = layui.layer
            , layedit = layui.layedit
            , laydate = layui.laydate
            , $ = layui.jquery
            ,upload = layui.upload;


        //执行一个laydate实例
        laydate.render({
            elem: '#lssueDate' //指定元素
        });

        //监听提交
        form.on('submit(data-blockchain)', function (data) {
            showloading(true);
            delete data.field.hashValue;
            $.ajax({
                url: "https://test.ellipticcurve.com.cn:8083/test/insertHashValue",
                type: "post",
                dataType: "json",
                data: JSON.stringify(data.field),
                headers: {
                    "Authorization": "eyJhbGciOiJIUzUxMiJ9.eyJzdWIiOiJhZG1pbiIsImV4cCI6MTU5Nzc2MTYzNywiaWF0IjoxNTk3NzQzNjM3fQ.8vQ-U0QHfB0Ss6fDRRGpdwhB5ra7cvhYOVt31lL_Ii4P5UjqXf_XUbJZBaj82_yN9iwN1J6LBQLJWWobM3MaEw",
                    "Content-Type": "application/json"
                },
                success: function (result) {
                    showloading(false)
                    $("#hashValueShow").val(result.data.hashValue);
                    var data=result.data;
                    console.log(result);
                    console.log(result.data);
                    parent.layer.open({
                        title: "blockchain info",
                        area: ['550px', '300px'],
                        content:'<div class="layui-form-item" STYLE="margin-top: 20px">'+
                            '            <label class="layui-form-label">存证Hash:</label>'+
                            '            <div class="layui-input-block">'+
                            /*'                <input type="text" id="titleName" class="layui-input" style="border: 0" value="'+data.hashValue+'" name="titleName" readonly>'+*/
                            '<textarea rows="2" cols="" style="border: 0;width: 300px;margin-left: 7px" id="hashValue">'+data.hashValue+'</textarea>'+
                            '            </div>'+
                            '        </div>'+
                            '        <div class="layui-form-item">'+
                            '            <label class="layui-form-label">上链Hash:</label>'+
                            '            <div class="layui-input-block">'+
                            /*'                <input type="textarea" name="album" class="layui-input" value="'+data.txId+'" id="album" readonly>'+*/
                            '<textarea rows="2" cols="" style="border: 0;width: 300px;margin-left: 7px" id="teamIntroduction">'+data.txId+'</textarea>'+
                            '            </div>'+
                            '        </div>'+
                            '        <div class="layui-form-item">'+
                            '            <label class="layui-form-label">上链时间:</label>'+
                            '            <div class="layui-input-block">'+
                            '                <input type="text" name="song" class="layui-input" style="border: 0" value="'+data.txTimeStamp+'"  id="song" readonly>'+
                            '            </div>'+
                            '        </div>'+
                            '       '
                    })
                }, error: function (err) {
                    showloading(false);
                    parent.layer.msg(err.msg)
                }

            })
            return false;
        });


    });

    function verifyFile(fileName) {
        var fileType = fileName.substr(fileName.lastIndexOf(".")).toUpperCase();
        if (fileType != ".MP3") {
            parent.layer.msg("音乐文件限于mp3格式");
            return false;
        }else{
            return true;
        }
    }

    function showloading(t) {
        if (t) {//如果是true则显示loading
            console.log(t);
//1。
            /*loading = parent.layer.load(1, {
                shade: [0.1, '#fff'] //0.1透明度的白色背景
            });*/
//1.end
//2.带文字的
            var loadingIndex = parent.layer.load(2, { //icon支持传入0-2
                shade: [0.5, 'gray'], //0.5透明度的灰色背景
                content: '发票上链中...',
                success: function (layero) {
                    layero.find('.layui-layer-content').css({
                        'padding-top': '39px',
                        'width': '120px'
                    });
                }
            });
//2 end
        } else {//如果是false则关闭loading
            console.log("关闭loading层:" + t);
            parent.layer.closeAll('loading');
        }
    }
</script>
</html>
